<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.11.0/axios.min.js"></script>

    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <script src="static/highlight.min.js"></script>
    <script src="static/wangEditor.min.js"></script>
    <link rel="stylesheet" href="static/monokai-sublime.min.css">
</head>
<body>
    <div id="app">
        <el-form :label-position="labelPosition" label-width="80px" :model="easy">
            <el-form-item label="时间">
                <el-date-picker
                        v-model="easy.createtime"
                        type="datetime"
                        placeholder="选择日期时间">
                </el-date-picker>
            </el-form-item>
            <el-form-item>
            </el-form-item>
            <el-form-item>
            </el-form-item>
            <el-form-item>
            </el-form-item>
            <el-form-item>
            </el-form-item>
            <el-form-item>
            </el-form-item>
            <el-form-item>
            </el-form-item>
            <el-form-item label="名称">
                <el-input v-model="easy.title"></el-input>
            </el-form-item>
            <el-form-item label="作者">
                <el-input v-model="easy.author"></el-input>
            </el-form-item>
            <el-form-item label="内容">
                <div id="edit"></div>
            </el-form-item>
            <el-form-item>
                <el-button @click="update" type="primary">保存</el-button>
            </el-form-item>
        </el-form>
    </div>
</body>

<script>
    const E  = window.wangEditor
    const edit =  new E("#edit")

    new Vue({
        el:"#app",
        data:{
            labelPosition: 'left',
            easy:{}
        },
        created(){
            let id = location.search.substring(1).split("=")[1]
            axios.get(`easy/findbyid.do?id=${id}`).then((resp)=>{
                this.easy = resp.data
                edit.txt.html(resp.data.context)
            }).catch((err)=>{
                this.$message.error("查询失败，请练习题管理员或重试")
            })
        },
        mounted(){
            edit.create()
        },
        methods:{
            update(){
                this.easy.context = edit.txt.html()
                axios.post(`easy/save.do`,this.easy).then((resp)=>{
                    if(resp.data.status){
                        this.$message.success(resp.data.msg)
                    }
                }).catch((err)=>{

                })
            }
        }
    })
</script>
</html>